<!--
 * @Author: zqx me_zqx@163.com
 * @Date: 2025-02-08 11:32:29
 * @LastEditors: zqx me_zqx@163.com
 * @LastEditTime: 2025-03-10 17:49:00
 * @FilePath: /XMate-h5/src/views/customer/customerDetail/components/todo/todoInfoCard.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
    <div class="flex flex-row justify-between p-4 bg-[#F9FAFC] text-xs">
      <div class="flex flex-row justify-between w-full">
        <div class="mr-3 pt-1">
          <van-checkbox
            shape="square"
            icon-size="18px"
            v-model="item.done"
            @change="handleChange"
          ></van-checkbox>
        </div>
        <div class="flex flex-col w-full pr-2">
          <div class="text-[#262626] mb-2 text-sm">
            {{ item.todoContent }}
          </div>
          <div class="text-[#8C8C8C] mb-2">
            截止时间: {{ item.deadline?.slice(0, 10) || "-" }} 执行人:
            {{ item.executor }}
          </div>
          <span class="text-[#8C8C8C]"
            >来源:<span
              @click="onClickMeet"
              class="text-yxt-blue cursor-pointer"
              >{{ item.subject }}</span
            ></span
          >
        </div>
      </div>
      <!-- <van-icon name="ellipsis" size="24" color="#8C8C8C" /> -->
    </div>
  </div>
</template>

<script setup>
import { defineProps, defineEmits } from "vue";
import { useCustomerStore } from "@/store";
import { openMeetingRecord } from "@/utils/urlTool";

const emits = defineEmits(["onChange"]);
const store = useCustomerStore();
function onClickMeet() {
  openMeetingRecord(props.item.conferenceId);
}

const props = defineProps({
  item: {
    type: Object,
    default: () => ({})
  }
});

async function handleChange(v) {
  const { conferenceId, id, todoContent } = props.item;
  const parameter = {
    done: v,
    todoContent
  };
  await store.updateCustomerTodoStatusAction(conferenceId, id, parameter);
  emits("onChange");
}
</script>

<style lang="less" scoped></style>
